import { Component, Input, ChangeDetectionStrategy, EventEmitter, Output } from '@angular/core';

import { Cell } from '../../../lib/data-set/cell';

@Component({
  selector: 'table-cell-view-mode',
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `
    <div [ngSwitch]="cell.getColumn().type">
        <custom-view-component *ngSwitchCase="'custom'" [cell]="cell"></custom-view-component>
        <div *ngSwitchCase="'html'" [innerHTML]="cell.getValue()"></div>
        <div *ngSwitchCase="'checkbox'" ><input (click)="onClick($event.target)" type="CheckBox" name="hobby" value="{{cell.getId()}}"/>{{cell.getValue()}}</div>
        <div *ngSwitchDefault>{{ cell.getValue() }}</div>
    </div>
    `,
})
export class ViewCellComponent {

  @Input() cell: Cell;
  @Input() cellSelect = new EventEmitter<any>();

  onClick(obj) {
    this.cellSelect.emit({
      cell:this.cell,
      obj:obj
    });
  }
}
